<!--Generate by Kevin's CodeBuilder -->
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>工作流管理系统</title>
<head  th:replace="source::header"></head>
<style type="text/css">
body {
	padding: 6px 6px;
}

#addRoot {
	text-decoration: underline;
	cursor: pointer;
}
</style>
</head>
<body>
	<div>
		<a id="addRoot">[(${Lang.menu_addRoot})]</a>
	</div>
	<div style="padding-left: 30px">
		<ul id="tree"></ul>
	</div>
	<script type="text/javascript">
		var win,
			tree,
			rootId,
			$tree,
			height = 500;
		var curdObj = {
			add:function(data){				
				$B.request({
					data:data,
					url:$B.getHttpHost(ctxPath) + "menu/add",
					ok:function(message, data){
						win.close();
						queryTree(rootId);
						$B.success("保存成功！",1.2);
					}
				});
			},
			update:function(data){
				$B.request({
					data:data,
					url:$B.getHttpHost(ctxPath) + "menu/update",
					ok:function(message, data){
						win.close();
						queryTree(rootId);
						$B.success("保存成功！",1.2);
					}
				});
			},
			closeWindow:function(){
				win.close();
			},
			setVueForm:function (vform) {
				this.vform = vform;
			}
		};
		var title = "[(${Lang.menu_windowTitle})]";//国际化语言
		//打开form.html
		function _openForm(prs,isUpdate){
			let data = prs.data;
			var url = $B.getHttpHost(ctxPath) + "menu/page/form";
			if(isUpdate){
				url = url + "?id="+data.id;
			}else{
				url = url + "?pid="+data.id;
			}
			var opts = {
				dataType:'html',
				title:title + "["+data.text+"]",
				width:700,
				height:height,
				url: url,
				onClosed:()=>{
					console.log("destroy vue form");
					curdObj.vform.toDestroy();
					curdObj.vform = undefined;
				}
			};			
			win = $B.window(opts);
		};
		
		window["toolbarMethods"] = {
			add01Fn:function(prs){
				_openForm(prs);
			},
			update01Fn:function(prs){
				_openForm(prs,true);
			},
			delete01Fn:function(prs){
				let data = prs.data;
				$B.confirm({
					content:'<span>[(${Lang.menu_deleteConfirm})]'+'<span style="color:red">('+data.text+')</span></span>',
					okFn:function(){
						$B.request({
							data:{idList : data.id,pid:data.data.pid},
							url:$B.getHttpHost(ctxPath) + "menu/delete",
							ok:function(message, data){								
								queryTree(rootId);
							}
						});
					}
				});
			}				
		};
		function queryTree(pid){
			$B.request({
				data:{pid:pid},
				url:$B.getHttpHost(ctxPath) + "menu/query",
				ok:function(message, data){
					createTree(data);
				}
			});
		}
		function createTree(treeJson){
			if(tree){
				tree.clear();
			}
			if(treeJson.length === 0){
				$B.DomUtils.append($tree,"<li>[(${Lang.common_dataEmpty})]</li>");
				return;
			}
			console.log(treeJson);
		    tree = new $B.Tree($tree, {
                data: treeJson, //'数据'	
				toolAutoHide:false,
				tree2list:false,
                nodeParentIcon: 'fa-folder-empty', //父节点图标关闭状态
                nodeParentOpenIcon: 'fa-folder-open-empty', //打开状态图标
                leafNodeIcon: 'fa-doc', //子节点图标 
                checkbox: false,
                fontIconColor: '#5F52E3'
	        });
		}
		$B.DomUtils.onDomLoaded(function(){
			var treeJson = [(${treeJson})];
			$tree = document.getElementById("tree");
			rootId = '[(${pid})]';
			createTree(treeJson);
			var addBtn = document.getElementById("addRoot");
			$B.DomUtils.click(addBtn,function(){
				var opts = {
					dataType:'html',
					title:'[(${menu_childmrg})]',
					width:700,
					url: $B.getHttpHost(ctxPath) + "menu/page/form?pid="+rootId,
					onClosed:()=>{
						console.log("destroy vue form");
						curdObj.vform.toDestroy();
						curdObj.vform = undefined;
					}
				};
				win = $B.window(opts);
			});
		});	
	</script>
</body>
</html>